<template>
    <el-table :data="tableData" style="width: 100% ">
        <el-table-column label="排行" width="180" >
          <template #default="scope">
            <div style="display: flex; align-items: center">
              <span style="margin-left: 10px">{{ scope.row.registerId }}</span>
            </div>
          </template>
        </el-table-column>
        <el-table-column label="药品分类" width="180">
          <template #default="scope">
            <el-popover
              effect="light"
              trigger="hover"
              placement="top"
              width="auto"
            >
              <template #reference>
                {{ scope.row.registerMoney }}
              </template>
            </el-popover>
          </template>
        </el-table-column>
        <el-table-column label="药品名称" width="180">
          <template #default="scope">
            <el-popover
              effect="light"
              trigger="hover"
              placement="top"
              width="auto"
            >
              <template #reference>
                {{ scope.row.departmentName }}
              </template>
            </el-popover>
          </template>
        </el-table-column>
        <el-table-column label="规格" width="180">
          <template #default="scope">
            <el-popover
              effect="light"
              trigger="hover"
              placement="top"
              width="auto"
            >
              <template #reference>
                {{ scope.row.doctorName }}
              </template>
            </el-popover>
          </template>
        </el-table-column>
        <el-table-column label="数量" width="180">
          <template #default="scope">
            <el-popover
              effect="light"
              trigger="hover"
              placement="top"
              width="auto"
            >
              <template #reference>
                {{ scope.row.patientName }}
              </template>
            </el-popover>
          </template>
        </el-table-column>
        <el-table-column label="总价" width="180    ">
          <template #default="scope">
            <el-popover
              effect="light"
              trigger="hover"
              placement="top"
              width="auto"
            >
              <template #reference>
                {{ scope.row.registerTime }}
              </template>
            </el-popover>
          </template>
        </el-table-column>
      </el-table>
  </template>
  
  <script lang="ts" setup>
  const tableData  = [
      {
          registerId: "",
          registerMoney: "",
          departmentName: "",
          doctorName: "",
          patientName: "",
          registerTime: "",
          
      },
      {
        registerId: "",
          registerMoney: "",
          departmentName: "",
          doctorName: "",
          patientName: "",
          registerTime: "",
      },
      {
        registerId: "",
          registerMoney: "",
          departmentName: "",
          doctorName: "",
          patientName: "",
          registerTime: "",
      },
      {
        registerId: "",
          registerMoney: "",
          departmentName: "",
          doctorName: "",
          patientName: "",
          registerTime: "",
      },
  ]
  </script>
  
  <style>
  
  </style>